var screenAnimateElements = {

	'.screen-1': [
		'.screen-1__heading',
		'.screen-1__phone',
		'.screen-1__shadow'
	],
	'.screen-2': [
		'.screen-2__heading',
		'.screen-2__subheading',
		'.screen-2__phone',
		'.screen-2__point',
		'.screen-2__point_1',
		'.screen-2__point_2',
		'.screen-2__point_3'
		
	],
	'.screen-3': [
		'.screen-3__heading',
		'.screen-3__subheading',
		'.screen-3__phone',
		'.screen-3__features',
	],
	'.screen-4': [
		'.screen-4__heading',
		'.screen-4__subheading',
		'.screen4__type__item_1',
		'.screen4__type__item_2',
		'.screen4__type__item_3',
		'.screen4__type__item_4'
	],
	'.screen-5': [
		'.screen-5__heading',
		'.screen-5__subheading',
		'.screen-5__bg'
	],

}
function setScreenAnimate(screenCls){
	var screen = document.querySelector(screenCls);
	var animateElements = screenAnimateElements[screenCls];
	// 初始化init
	var isSetAnimateClass = false;
	// 
	var isAnimateDone = false;
	screen.onclick=function(){
		if(isSetAnimateClass===false){
			for(var i=0;i<animateElements.length;i++){
				var elemet = document.querySelector(animateElements[i]);
				var baseCls = elemet.getAttribute('class');
				elemet.setAttribute("class",baseCls +' '+ animateElements[i].substr(1)+'_animate_init')	
			}
			isSetAnimateClass = true;
			return;
		}
		
		if(isAnimateDone===false){
			for(var i=0;i<animateElements.length;i++){
				var elemet = document.querySelector(animateElements[i]);
				var baseCls = elemet.getAttribute('class');
				elemet.setAttribute("class",baseCls.replace('_animate_done','_animate_init'))
			}
			isAnimateDone = true
			return;

		}
		if(isAnimateDone===true){
			for(var i=0;i<animateElements.length;i++){
				var elemet = document.querySelector(animateElements[i]);
				var baseCls = elemet.getAttribute('class');
				elemet.setAttribute("class",baseCls.replace('_animate_init','_animate_done'))
			}
			isAnimateDone = false;

		}
	
	}

}

for( k in screenAnimateElements){
	setScreenAnimate(k);
}

